<!DOCTYPE html>
<html>
<!--
Created using jsbin.com
Source can be edited via http://jsbin.com/acurec/123/edit
-->
<head>
    <meta charset=utf-8 />
    <title>Calculator</title>
    <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/jisuanqi.css"/>

</head>
<body>
<div id="calculator">
    <div class="head">
        <span class="clear">c</span>
        <div class="show"></div>
    </div>
    <div class="keys">

        <span>1</span>
        <span>2</span>
        <span>3</span>
        <span>+</span>
        <span>4</span>
        <span>5</span>
        <span>6</span>
        <span class="sign">-</span>
        <span>7</span>
        <span>8</span>
        <span>9</span>
        <span class="sign">*</span>
        <span>0</span>
        <span>.</span>
        <span>=</span>
        <span class="sign">/</span>
    </div>
</div>
<script>
    window.onload=function()
    {
        var oShow=getByClass("calculator","show")[0];
        var aNum=document.getElementById("calculator").getElementsByTagName("span");
        for(var i=0,iLen=aNum.length;i<iLen;i++)
        {
            aNum[i].onclick=function()
            {
                var oShowVal=oShow.innerHTML;
                var oNumVal=this.innerHTML;
                var num1,num2=null;
                num1=oShowVal;
//判断按键
                if(oNumVal=="c")
                {
                    oShow.innerHTML="";
                }
                else if(oNumVal=="=")
                {
                    var oResult=eval(oShowVal);
                    oShow.innerHTML=oResult;
                }
                else
                {
                    oShow.innerHTML+=oNumVal;
                }
            }
        }
    }
    function getByClass(root,sClass)
    {
        var obj=document.getElementById(root);
        var arr=[];
        var aItems=obj.getElementsByTagName("*");
        for(var i=0;i<aItems.length;i++)
        {
            if(aItems[i].className==sClass)
            {
                arr.push(aItems[i]);
            }
        }
        return arr;
    }
</script>
</body>
</html>